<!-- 费用结算作业-2：蹇泽阳 -->
<template>
  <div class="app-container">
    <Find :OriginalFilter="{ static: true }" :formList="formList" @findClicked="findClicked" @clickNumber="clickNumber" />
    <Find :searchImg="false" :OriginalFilter="{ static: true }" :formList="formList2" @findClicked="findClicked2" />
    <div class="mt10" style="width: 100%; background-color: white">
      <el-card shadow="never" :body-style="{ padding: '5px 10px 0px' }">
        <div class="flex AIC">
          <h1 class="f16">费用查询明细</h1>
          <el-button class="ml10" style="background-color: red" type="primary" size="default" @click="removeList">删除勾选数据</el-button>
        </div>
        <Table
          :tableHeader="tableHeader"
          :tableData="tableData"
          selection
          class="mt10"
          :isLoading="isLoading"
          @currentRow="currentRow"
          :summaryData="summaryData"
          @confirmChange="confirmChange"
          summary
          @selectList="selectTableList"
          @sortChange="sortChange"
          :TableHeight="70"
          :outTableHeight="150"
        />
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '0px' }">
        <PageModule :PageData="{ total, buttonS: true }" @pageSizeChange="handleSizeChange" @pageChange="handleCurrentChange" />
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '5px 10px 0px' }">
        <div class="flex">
          <h1 class="f16">费用明细输入</h1>
          <!-- <AddOne :tableHeader="tableHeader2" :tableData="tableData2" @Save="Save2" /> -->
          <JDialog
            :tableHeader="JTableHeader2"
            :width="73"
            @removeOne="removeOne2"
            :currentTableRow="currentTableRow2"
            :unEdit="true"
            @confirm="confirm2"
          />
        </div>
        <div class="flex">
          <JTable
            :tableHeader="tableHeader2"
            :tableData="tableData2"
            class="mt10"
            :isLoading="isLoading2"
            @currentRow="currentRow2"
            :summaryData="summaryData2"
            summary
            :TableHeight="30"
            :outTableHeight="150"
            @inputChange="inputChange2"
          />
          <div class="flex2 ml10">
            <el-date-picker v-model="date" type="date" format="YYYY/MM/DD" value-format="YYYY-MM-DD" placeholder="单据日期" />
            <el-select v-model="dept" clearable filterable placeholder="部门">
              <el-option v-for="item in deptOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
            <el-select v-model="vender" clearable filterable placeholder="厂商">
              <el-option v-for="item in venderOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
            <el-select placeholder="费用类型" v-model="category" clearable filterable>
              <el-option v-for="item in categoryOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
            <el-select placeholder="结算方式" v-model="settleMethod" clearable filterable>
              <el-option v-for="item in settleMethodOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
            </el-select>
            <el-input v-model="slipNo" placeholder="送货单号" clearable></el-input>
          </div>
          <div class="flex2 ml10">
            <el-button class="primaryBth" type="primary" size="default" @click="addOne">增加</el-button>
            <el-button class="primaryBth" type="primary" size="default" @click="selectMtl">选择补单材料</el-button>
            <el-button class="primaryBth" type="primary" size="default" @click="router.push('/PurchasingDepartment/FactoryInquiryT/InstructionUsage')"
              >转指令用量查询</el-button
            >
            <el-button
              class="primaryBth"
              type="primary"
              size="default"
              @click="router.push('/GeneralFinanceDepartment/FactoryMaterialCost/HarvestReconciliationJobOne')"
              >转收货结算作业</el-button
            >
            <el-button class="primaryBth" type="primary" size="default" @click="">修改结算方式</el-button>
          </div>
        </div>
      </el-card>
    </div>

    <el-drawer v-model="drawer" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <div class="flex AIC" style="flex-direction: column">
        <Find :searchImg="false" :formList="formList10" @findClicked="findClicked10" />
        <div class="flex mt10 JCC" style="width: 100%; background-color: white">
          <el-card shadow="never" :body-style="{ padding: '5px 10px 5px' }">
            <div class="flex">
              <h1 class="f16">选择补单材料</h1>
            </div>
            <Table
              :tableHeader="tableHeader10"
              :tableData="tableData10"
              selection
              class="mt10"
              :outTableHeight="150"
              @selectList="selectTableList10"
              @currentRow="currentRow10"
            />
          </el-card>
        </div>
      </div>
    </el-drawer>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import LoginWork from '@/utils/LoginWork'
import router from '@/router'
import { formateData } from '@/plugins/mixinJ'
import fileRequest from '@/utils/fileRequest'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'CostSettlementOperationTwo'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import service from '@/utils/request'
import { debounce } from 'lodash'
import { onMounted, watch } from 'vue'
const removeList = async () => {
  ElMessageBox.confirm('是否确认删除?', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(async () => {
    const res = (await LoginWork.post(
      `/mtlCosts/costDetailDelete`,
      selectedLists.value.map((item: any) => {
        return item.id
      })
    )) as any
    // 判断请求是否成功
    if (res.code === 200) {
      JMessage.success(res.message)
      getTableList()
    } else {
      JMessage.error(res.message)
    }
  })
}

const formList = ref([
  {
    type: 'input',
    inputPlaceholder: '单据号码',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '送货单号',
    inputValue: ''
  },
  {
    type: 'date',
    dateLabel: '单据日期',
    dateValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '部门',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '费用类型',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '结算方式',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'date',
    dateLabel: '制单日期',
    dateValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '指令号',
    inputValue: ''
  },
  {
    dateType: 'month',
    type: 'dateMonth',
    dateLabel: '结算月份',
    dateValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '费用描述',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '结算单号',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '备注',
    inputValue: ''
  },
  {
    type: 'radio',
    checkboxLabel: '未结算',
    label: '1'
  },
  {
    type: 'radio',
    checkboxLabel: '已结算',
    label: '2'
  },
  {
    type: 'radio',
    checkboxLabel: '已结算未应付',
    label: '3'
  },
  {
    type: 'radio',
    checkboxLabel: '已结算已应付',
    label: '4'
  },
  {
    type: 'radio',
    checkboxLabel: '全部',
    label: '5'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '修改'
  },
  {
    type: 'button',
    checkboxLabel: '指定扣款'
  },
  {
    type: 'button',
    checkboxLabel: '导入'
  },
  {
    type: 'button',
    checkboxLabel: '导出'
  }
]) as any
const formList2 = ref([
  {
    dateType: 'month',
    type: 'dateMonth',
    dateLabel: '结算月份',
    dateValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '打勾记录结算'
  },
  {
    type: 'button',
    checkboxLabel: '打勾记录取消结算'
  }
])

const tableHeader = ref([
  {
    change: true,
    backgroundColor: true,
    width: '120',
    sortable: 'column',
    label: '单据号码',
    prop: 'slipNo'
  },
  {
    change: true,
    sortable: 'column',
    label: '单据日期',
    prop: 'slipDate'
  },
  {
    change: true,
    sortable: 'column',
    label: '制单日期',
    prop: 'sysDate'
  },
  {
    change: true,
    sortable: 'column',
    width: '100',
    label: '部门',
    prop: 'deptNo'
  },
  {
    change: true,
    sortable: 'column',
    width: '150',
    label: '指令号',
    prop: 'lotNo'
  },
  {
    change: true,
    sortable: 'column',
    label: '费用类型',
    prop: 'typeName'
  },
  {
    change: true,
    sortable: 'column',
    label: '厂商',
    prop: 'vendorName'
  },
  {
    change: true,
    width: '120',
    sortable: 'column',
    label: '送货单号',
    prop: 'sendNo'
  },
  {
    change: true,
    sortable: 'column',
    width: '180',
    label: '费用描述',
    prop: 'costDesc'
  },
  {
    change: true,
    sortable: 'column',
    label: '数量',
    prop: 'qty'
  },
  {
    change: true,
    sortable: 'column',
    label: '单位',
    prop: 'costUnit'
  },
  {
    change: true,
    sortable: 'column',
    label: '单价',
    prop: 'price'
  },
  {
    change: true,
    sortable: 'column',
    label: '金额',
    prop: 'amt'
  },
  {
    change: true,
    sortable: 'column',
    label: '结算方式',
    prop: 'accountName'
  },
  {
    change: true,
    sortable: 'column',
    label: '结算月份',
    prop: 'financeYymm'
  },
  {
    change: true,
    sortable: 'column',
    label: '备注',
    prop: 'remark'
  },
  {
    change: true,
    sortable: 'column',
    label: '扣款',
    prop: 'processStatus'
  },
  {
    change: true,
    width: '150',
    sortable: 'column',
    label: '结算单号',
    prop: 'balanceNo'
  },
  {
    label: '备注信息',
    prop: 'remarkCw'
  },
  {
    change: true,
    label: '制单员',
    prop: 'sysUser'
  }
])
// 表一模块
// 表一按钮
const findClicked = async (content: string) => {
  if (content === '置空') {
    formList.value.forEach((item: any) => {
      item.inputValue = ''
      item.selectValue = ''
      item.dateValue = ''
    })
  }

  if (content === '修改') {
    if (selectedLists.value.length === 0) {
      JMessage.warning('请勾选表格数据')
      return
    }
    ElMessageBox.confirm('是否确认修改?', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    }).then(async () => {
      const res = (await LoginWork.post(`/mtlCosts/costDetailToTemp?type=${1}`, selectedLists.value)) as any
      if (res.code === 200) {
        if (selectedLists.value[0].slipDate) date.value = selectedLists.value[0].slipDate
        if (selectedLists.value[0].vendorName) vender.value = selectedLists.value[0].vendorName
        if (selectedLists.value[0].typeName) category.value = selectedLists.value[0].typeName
        if (selectedLists.value[0].sendNo) slipNo.value = selectedLists.value[0].sendNo
        getTableList()
        getTableList2()
      } else {
        JMessage.error(res.message)
      }
    })
  }
  if (content === '指定扣款') {
    if (selectedLists.value.length === 0) {
      JMessage.warning('请勾选表格数据')
      return
    }
    const res = (await LoginWork.post(`/mtlCosts/costDetailToTemp?type=${2}`, selectedLists.value)) as any
    if (res.code === 200) {
      JMessage.success('新增成功')
      getTableList()
      getTableList2()
    } else {
      JMessage.error(res.message)
    }
  }
  if (content === '导出') {
    const res = (await fileRequest.post(`/mtlCosts/costDetail/export`, {
      accountName: formList.value.find(
        (item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '结算方式'
      )?.selectValue,
      deptName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '部门')
        ?.selectValue,
      balanceNo: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '结算单号'
      )?.inputValue,
      costDesc: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '费用描述'
      )?.inputValue,
      financeYymm: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '结算月份'
      )?.dateValue,
      lotNo: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '指令号'
      )?.inputValue,
      // orderFlag: orderFlag, // 1：正序 2：倒序
      // orderName: orderName, // 排序字段
      sendNo: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '送货单号'
      )?.inputValue,
      slipDateEnd: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '单据日期'
      )?.dateValue?.[1],
      slipDateStart: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '单据日期'
      )?.dateValue?.[0],
      slipNo: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '单据号码'
      )?.inputValue,
      sysDateEnd: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '制单日期'
      )?.dateValue?.[1],
      sysDateStart: formList.value.find(
        (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '制单日期'
      )?.dateValue?.[0],
      typeName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '费用类型')
        ?.selectValue,
      vendorName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
        ?.selectValue,
      remark: formList.value.find(
        (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '备注'
      )?.inputValue,
      pageNum: currentPage.value,
      pageSize: pageSize.value,
      flag: flag.value
    })) as any
    const link = document.createElement('a') // 利用a标签自定义下载文件名
    let blob = new Blob([res.data]) // 创建Blob对象，设置文件类型
    link.style.display = 'none'
    //设置连接
    link.href = window.URL.createObjectURL(blob)
    const FileName = decodeURI(res.headers['content-disposition'].split(`utf-8''`)[1])
    link.download = FileName //自定义文件名字
    document.body.appendChild(link)
    //模拟点击事件
    link.click()
    document.body.removeChild(link)
  }
  if (content === '导入') {
    upload()
  }
}
const upload = async () => {
  const fileType = ['xls', 'xlsx']
  const inputFile = document.createElement('input')
  const maxFileSizeMb = 2
  const maxFilesSizeBytes = maxFileSizeMb * 1024 * 1024
  inputFile.type = 'file'
  inputFile.style.display = 'none'
  document.body.appendChild(inputFile)
  inputFile.addEventListener('change', async function () {
    const files = inputFile.files as any // 获取文件数组
    const file = files[0] // 获取第一个文件对象
    const fileExtension = file.name.split('.').pop()
    if (!fileType.includes(fileExtension as any)) {
      JMessage.warning('上传的文件格式只能是 xls, xlsx')
      document.body.removeChild(inputFile)
      return false
    }
    if (file.size > maxFilesSizeBytes) {
      JMessage.warning('文件大小不能超过2MB!!!')
      document.body.removeChild(inputFile)
      return
    }
    const formData = new FormData()
    formData.append('file', file) // 添加文件对象及文件名
    const result = (await LoginWork.put('/mtlCosts/costDetail/import', formData)) as any
    if (result.code === 200) {
      JMessage.success(result.message)
      getTableList()
    } else {
      JMessage.error(result.message)
    }
  })
  inputFile.click()
}
const tableData = ref([])
const isLoading = ref(true)
// 总计
interface summaryDataType {
  index: number
  num: number | undefined
}
const summaryData = ref<summaryDataType[]>([
  {
    index: 10,
    num: 0
  },
  {
    index: 13,
    num: 0
  }
])
// 分页器
const currentPage = ref(1)
const pageSize = ref(40)
const total = ref(0)
const handleSizeChange = (val: number) => {
  pageSize.value = val
  getTableList()
}
const handleCurrentChange = (val: number) => {
  currentPage.value = val
  getTableList()
}
const flag = ref(1)
const clickNumber = (val: any) => {
  flag.value = val
  getTableList()
}
const sortChange = (order: any, prop: any, column: any) => {
  let orderFlag = null
  if (order === null) {
    orderFlag = null
  } else if (order === 'ascending') {
    orderFlag = 1
  } else if (order === 'descending') {
    orderFlag = 2
  }
  getTableList(orderFlag, prop)
}
// 获取表数据
const getTableList = debounce(async (orderFlag: any = '', orderName: string = '') => {
  isLoading.value = true
  let tableDataList = await service.post<any, any>('/mtlCosts/costDetailQuery', {
    accountName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '结算方式')
      ?.selectValue,
    deptName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '部门')
      ?.selectValue,
    balanceNo: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '结算单号'
    )?.inputValue,
    costDesc: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '费用描述'
    )?.inputValue,
    financeYymm: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '结算月份'
    )?.dateValue,
    lotNo: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '指令号'
    )?.inputValue,
    orderFlag: orderFlag, // 1：正序 2：倒序
    orderName: orderName, // 排序字段
    sendNo: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '送货单号'
    )?.inputValue,
    slipDateEnd: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '单据日期'
    )?.dateValue?.[1],
    slipDateStart: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '单据日期'
    )?.dateValue?.[0],
    slipNo: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '单据号码'
    )?.inputValue,
    sysDateEnd: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '制单日期'
    )?.dateValue?.[1],
    sysDateStart: formList.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '制单日期'
    )?.dateValue?.[0],
    typeName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '费用类型')
      ?.selectValue,
    vendorName: formList.value.find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
      ?.selectValue,
    remark: formList.value.find(
      (item: any) => item.inputPlaceholder && Jzhcn.Find[item.inputPlaceholder.split('.')[1] as keyof typeof Jzhcn.Find] === '备注'
    )?.inputValue,
    pageNum: currentPage.value,
    pageSize: pageSize.value,
    flag: flag.value
  })
  isLoading.value = false
  tableData.value = tableDataList.dtos.map((item: any) => {
    item.change = 'Y'
    if (item.cfmFlag) {
      item.backgroundColor = '#80C080'
    }
    return item
  })
  total.value = tableDataList.total

  currentRow()
  summaryData.value[0].num = tableDataList.qtySum
  summaryData.value[1].num = tableDataList.amtSum
}, 500)
onMounted(() => {
  getTableList()
})
watch(
  () =>
    formList.value.map((item: any) => {
      item.selectValue, item.inputValue, item.dateValue, item.checked
    }),
  () => {
    getTableList()
  }
)

// 点击表给另一张表传数据
const currentTableRow = ref({}) as any
const currentRow = async (row: any = tableData.value[0] ? tableData.value[0] : {}) => {
  currentTableRow.value = row
}
const selectedLists = ref([]) as any
const selectTableList = (selectedList: any) => {
  selectedLists.value = selectedList
}

// 删除
const removeOne = async () => {
  // 向服务器发送请求，更新外派单信息
  const res = (await LoginWork.post(`/mtlCosts/costDetailDelete?slipNo=${currentTableRow.value.slipNo}&item=${currentTableRow.value.item}`)) as any
  // 判断请求是否成功
  if (res.code === 200) {
    JMessage.success(res.message)
    getTableList()
  } else {
    JMessage.error(res.message)
  }
}

// 表二模块
const date = ref('')
const dateOptions = ref([]) as any
const dept = ref('') as any
const deptOptions = ref([]) as any
const vender = ref('')
const venderOptions = ref([]) as any
const category = ref('')
const categoryOptions = ref([]) as any
const settleMethod = ref('') as any
const settleMethodOptions = ref([]) as any
const slipNo = ref('')
const JTableHeader2 = ref([
  {
    type: 'selectJV2',
    width: 300,
    label: '指令号',
    prop: 'lotNo',
    options: [] as any,
    allowC: true
  },
  {
    width: '180',
    label: '费用描述',
    prop: 'costDesc'
  },
  {
    width: '80',
    label: '单位',
    prop: 'costUnit'
  },
  {
    width: '80',
    label: '数量',
    prop: 'qty'
  },
  {
    width: '80',
    label: '单价',
    prop: 'price'
  },
  {
    width: '150',
    label: '备注',
    prop: 'remark'
  }
])
const tableHeader2 = ref([
  {
    width: '150',
    label: '指令号',
    prop: 'lotNo'
  },
  {
    width: '180',
    label: '费用描述',
    prop: 'costDesc'
  },
  {
    width: '50',
    label: '单位',
    prop: 'costUnit'
  },
  {
    width: '50',
    label: '数量',
    prop: 'qty'
  },
  {
    width: '50',
    label: '单价',
    prop: 'price'
  },
  {
    width: '50',
    label: '金额',
    prop: 'amt'
  },
  {
    width: '150',
    label: '备注',
    prop: 'remark'
  },
  {
    change: true,
    width: '180',
    label: '单据号码',
    prop: 'feeSlipNo'
  },
  {
    change: true,
    width: '50',
    label: '状态',
    prop: 'feeStatus'
  },
  {
    change: true,
    width: '50',
    label: '项次',
    prop: 'feeItem'
  }
])
// 表二按钮
const findClicked2 = async (content: string) => {
  if (selectedLists.value.length === 0) {
    JMessage.warning('请勾选表格数据')
    return
  }
  if (content === '打勾记录结算') {
    const month = formList2.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '结算月份'
    )?.dateValue
    if (!month) {
      JMessage.warning('请输入结算月份')
      return
    }
    const res = (await LoginWork.put(`/mtlCosts/costDetailUp?financeType=${1}&financeYymm=${month}`, selectedLists.value)) as any
    if (res.code === 200) {
      JMessage.success('结算成功')
      getTableList()
    } else {
      JMessage.error(res.message)
    }
  }
  if (content === '打勾记录取消结算') {
    const month = formList2.value.find(
      (item: any) => item.dateLabel && Jzhcn.Find[item.dateLabel.split('.')[1] as keyof typeof Jzhcn.Find] === '结算月份'
    )?.dateValue
    const res = (await LoginWork.put(`/mtlCosts/costDetailUp?financeType=${2}&financeYymm=${month}`, selectedLists.value)) as any
    if (res.code === 200) {
      JMessage.success('取消结算成功')
      getTableList()
    } else {
      JMessage.error(res.message)
    }
  }
}
const tableData2 = ref([]) as any
const isLoading2 = ref(true)
// 总计
interface summaryDataType {
  index: number
  num: number | undefined
}
const summaryData2 = ref<summaryDataType[]>([
  {
    index: 5,
    num: 0
  },
  {
    index: 3,
    num: 0
  }
])
// 获取表数据
const getTableList2 = debounce(async () => {
  isLoading2.value = true
  let tableDataList = await service.get<any, any>('/mtlCosts/costTempQuery')
  isLoading2.value = false
  tableData2.value = tableDataList.dtos.map((item: any) => {
    item.change = 'Y'
    item.disableConfirm = true
    item.addAndUpdate = true
    return item
  })
  currentRow2()
  summaryData2.value[0].num = tableDataList.amtSum
  summaryData2.value[1].num = tableDataList.qtySum
}, 500)
onMounted(() => {
  getTableList2()
})
// 点击表给另一张表传数据
const currentTableRow2 = ref({}) as any
const currentRow2 = async (row: any = tableData2.value[0]) => {
  currentTableRow2.value = row
}
// 修改按钮
const inputChange2 = async (row: any) => {
  const res = (await LoginWork.put('/mtlCosts/costTempUpdate', row)) as any
  if (res.code === 200) {
    JMessage.success('修改成功')
    getTableList2()
  } else {
    JMessage.error(res.message)
  }
}
// 添加按钮函数
const addOne = async () => {
  if (!date.value || !vender.value || !category.value) {
    JMessage.warning('请选择日期、厂商、费用类型')
    return
  }
  const res2 = await LoginWork.post<any, any>('/mtlCosts/costTempToDetail', {
    accountName: settleMethod.value,
    deptNo: dept.value,
    sendNo: slipNo.value,
    slipDate: date.value,
    typeName: category.value,
    vendorName: vender.value
  })
  if (res2.code === 200) {
    JMessage.success('添加成功')
    getTableList()
    getTableList2()
    dept.value = ''
    slipNo.value = ''
    vender.value = ''
    category.value = ''
    settleMethod.value = ''
    date.value = ''
  } else {
    JMessage.error(res2.message)
  }
}
const Save2 = (arr: any, deleteArr: any) => {
  console.log(arr)
}
const confirm2 = async (obj: any, dialogVisible: any, title: any) => {
  // 打印出obj的值
  const tempList = formateData([obj]) as any
  // 向服务器发送请求，更新外派单信息
  if (title === '添加') {
    obj.amt = Number(obj.qty) * Number(obj.price)

    // 判断指令号是否为空
    if (obj.lotNo === '' || obj.lotNo === null) {
      const res = (await LoginWork.post(`/mtlCosts/costTempAdd`, obj)) as any
      // 判断请求是否成功
      if (res.code === 200) {
        JMessage.success(res.message)
        // 关闭弹出框
        dialogVisible.value = false
        // 重新获取表格数据
        getTableList2()
      } else {
        JMessage.error(res.message)
      }
    } else {
      // 判断指令号是否存在
      const res = (await LoginWork.get(`/back/getRyLotCheck?lotNo=${obj.lotNo}`)) as any
      // 判断请求是否成功
      if (res.code === 200) {
        const res = (await LoginWork.post(`/mtlCosts/costTempAdd`, obj)) as any
        // 判断请求是否成功
        if (res.code === 200) {
          JMessage.success(res.message)
          // 关闭弹出框
          dialogVisible.value = false
          // 重新获取表格数据
          getTableList2()
        } else {
          JMessage.error(res.message)
        }
      } else {
        JMessage.error(res.message)
      }
    }
  }
}
const removeOne2 = async () => {
  // 向服务器发送请求，更新外派单信息
  const res = (await LoginWork.put(`/mtlCosts/costTempDelete?item=${currentTableRow2.value.item}&slipNo=${currentTableRow2.value.slipNo}`)) as any
  // 判断请求是否成功
  if (res.code === 200) {
    JMessage.success(res.message)
    getTableList2()
  } else {
    JMessage.error(res.message)
  }
}

const selectList = async () => {
  let vendorName = await service.get<any, any>('/back/vendorQuery')
  // 插入厂商代码 厂商名称
  vendorName.forEach((item: any, index: any) => {
    if (item === null) return
    venderOptions.value.push({
      value: `${item.vendorName}`,
      label: `${item.vendorName}`
    })
    formList.value
      .find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '厂商')
      ?.selectOptions?.push({
        optionKey: `${item.vendorName}`,
        optionLabel: `${item.vendorName}`,
        optionValue: `${item.vendorName}`
      })
  })
  const res2 = (await service.get('/back/getPcCostType')) as any
  res2.forEach((item: any, index: any) => {
    // if (item === null && !item.type_name && !item.TYPE_NO) return
    categoryOptions.value.push({
      value: `${item.typeName}`,
      label: `${item.typeName}`
    })
    formList.value
      .find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '费用类型')
      ?.selectOptions?.push({
        optionKey: `${item.typeName}`,
        optionLabel: `${item.typeName}`,
        optionValue: `${item.typeName}`
      })
  })
  deptOptions.value.push(
    {
      value: `荣阳车间`,
      label: `荣阳车间`
    },
    {
      value: `荣信研发`,
      label: `荣信研发`
    }
  )
  settleMethodOptions.value.push(
    {
      value: `荣阳大货`,
      label: `荣阳大货`
    },
    {
      value: `荣信`,
      label: `荣信`
    },
    {
      value: 'KINGLIKE',
      label: 'KINGLIKE'
    }
  )
  formList.value
    .find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '结算方式')
    ?.selectOptions?.push(
      {
        optionKey: `荣阳大货`,
        optionLabel: `荣阳大货`,
        optionValue: `荣阳大货`
      },
      {
        optionKey: `荣信`,
        optionLabel: `荣信`,
        optionValue: `荣信`
      },
      {
        optionKey: `KINGLIKE`,
        optionLabel: `KINGLIKE`,
        optionValue: `KINGLIKE`
      }
    )
  formList.value
    .find((item: any) => item.selectP && Jzhcn.Find[item.selectP.split('.')[1] as keyof typeof Jzhcn.Find] === '部门')
    ?.selectOptions?.push(
      {
        optionKey: `荣阳车间`,
        optionLabel: `荣阳车间`,
        optionValue: `荣阳车间`
      },
      {
        optionKey: `荣信研发`,
        optionLabel: `荣信研发`,
        optionValue: `荣信研发`
      }
    )
}
onMounted(() => {
  selectList()
})

const selectMtl = () => {
  drawer.value = true
  // 调用查询接口
}
const formList10 = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入材料名称',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入规格',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '打勾记录插入'
  }
])
const drawer = ref(false)
const findClicked10 = async (content: string) => {
  if (content === '置空') {
    formList10.value.forEach((item: any) => {
      item.inputValue = ''
      item.selectValue = ''
      item.dateValue = ''
    })
  }
  if (content === '打勾记录插入') {
    // const res = await LoginWork.post('/Outgoing/GenerateOutsourcedMaterials', {
    //   outList: outList.value
    // }) as any
    // if (res.code === 200) {
    //   JMessage.success(res.message)
    //   outList.value = []
    //   drawer.value = false
    // } else {
    //   JMessage.error(res.message)
    // }
  }
}
const tableHeader10 = ref([
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '部位',
    prop: 'style'
  },
  {
    label: '物料编码',
    prop: 'color'
  },
  {
    label: '材料颜色',
    prop: 'orderQty'
  },
  {
    label: '材料名称',
    prop: 'partName'
  },
  {
    label: '规格',
    prop: 'partName'
  },
  {
    label: '单位',
    prop: 'partName'
  },
  {
    label: '用量',
    prop: 'partName'
  }
])
const tableData10 = ref([])
const selectedLists10 = ref([])
const selectTableList10 = (selectedList: any) => {
  selectedLists10.value = selectedList
}
const currentTable10Row = ref({}) as any
const currentRow10 = async (row: any = tableData10.value[0]) => {
  currentTable10Row.value = row
}

const getSelectList = async () => {
  const res = (await LoginWork.put(`/back/getRyLots`, {
    pageSize: 99999,
    pageNum: 1
  })) as any
  res.data.forEach((item: any) => {
    JTableHeader2.value[0].options?.push({
      value: item,
      label: item
    })
  })
}
onMounted(() => {
  getSelectList()
})

const confirmChange = async (row: any) => {
  const res = (await LoginWork.put(`/mtlCosts/costDetailUp?financeType=${3}&financeYymm=${''}`, [row])) as any
  if (res.code === 200) {
    JMessage.success('修改成功')
  } else {
    JMessage.error(res.message)
    getTableList()
  }
}
</script>

<style lang="less" scoped>
.flex2 {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
}
</style>
